<!-- MAIN CONTENT -->
<div id="content">
    <!--头部-->
    <div smart-include="sensor/views/sub-header.tpl.html"></div>
    <!--头部end-->
    <section id="widget-grid" class="all_bg">
        <!-- row -->
        <div class="clearfix">
            <div class="pull-left">
                <strong class="font-md">设备：</strong>
                <label>
                    <select class="form-control" ng-model="deviceid">
                        <option ng-repeat="device in devices" value="{{device.deviceid}}">{{device.devicename}}</option>
                    </select>
                </label>
            </div>
            <div class="pull-left">
                <strong class="font-md">方案：</strong>
                <label>
                    <select class="form-control" ng-model="planid" ng-change="selectPlan(planid)">
                        <option ng-repeat="plan in plans" value="{{plan.id}}">{{plan.name}}</option>
                        <option value="" selected hidden></option>
                    </select>
                </label>
            </div>
            <!-- 时间选择 -->
            <div class="pull-left">
                <strong class="font-md">时间范围：</strong>
                <label class="input">
                    <input type="text" style="padding:5px 0" name="startdate" id="startdate" placeholder="开始日期：">
                    <i class="icon-append fa fa-calendar"></i>
                </label>
                -
                <label class="input">
                    <select style="padding:7px 0 6px 0" ng-model="date.id" id="enddate">
                        <option ng-repeat="time in times" value="{{time.id}}">{{time.name}}</option>
                    </select>
                </label>
                <!-- 确定查询 -->
                <button class="btn btn-primary select" ng-click="sure_query(date.id)">查询</button>
            </div>
          
        </div>
        <!--end row-->
        <!-- row -->
        <div class="row">
            <article class="col-sm-12">
                <!-- new widget -->
                <div class="jarviswidget" id="wid-id-0" data-widget-togglebutton="false" data-widget-editbutton="false" data-widget-fullscreenbutton="false" data-widget-colorbutton="false" data-widget-deletebutton="false">
                    <header>
                        <span class="widget-icon"> <i class="glyphicon glyphicon-stats txt-color-darken"></i> </span>
                        <h2 style="text-align:center">{{company}}</h2>
                    </header>
                    <!-- widget div-->
                    <div class="no-padding">
                        <!-- widget edit box -->
                        <div class="jarviswidget-editbox">

                        </div>
                        <!-- end widget edit box -->

                        <div class="widget-body">
                            <!-- content -->
                            <div id="myTabContent" class="tab-content">
                                <div class="tab-pane fade active in padding-10 no-padding-bottom" id="s1">
                                    <div class="row no-space" style="padding-top:20px ;">
                                        <div class="col-lg-1 col-md-1 col-sm-1 col-xs-1 hidden-xs hidden-sm"></div>
                                        <div class="col-lg-3 col-md-3 col-sm-12 col-xs-12" id="line_box">
                                            <div id="line" style="width:100%;height:400%"></div>
                                            <div class="col-sm-10" id="lineField"></div>
                                        </div>
                                        <div class="col-lg-4 col-md-4 col-sm-12 col-xs-12" id="bar_box">
                                            <div id="bar" style="width:100%;height:400%"></div>
                                            <div class="col-sm-10" id="barField"></div>
                                        </div>
                                        <div class="col-lg-3 col-md-3 col-sm-12 col-xs-12" id="pie_box">
                                            <div id="pie" style="width:100%;height:400%"></div>
                                            <div class="col-sm-10" id="pieField"></div>
                                        </div>
                                        <div class="col-lg-1 col-md-1 col-sm-1 col-xs-1 hidden-xs hidden-sm"></div>
                                    </div>
                                </div>
                            </div>
                            <!-- end content -->
                        </div>
                    </div>
                    <!-- end widget div -->
                </div>
                <!-- end widget -->
            </article>
        </div>

        <!-- end row -->
        <!-- 画图表 -->
        <div class="row" ng-hide="table">
            <div class="col-lg-10 col-md-10 col-sm-12 col-xs-12 col-lg-push-1 col-md-push-1">
                <div class="table-responsive">
                    <table id="table_chart" class="table table-bordered no-margin font-sml table-striped sensor_table">
                        <thead>
                            <tr>
                                <th class="text-align-center" ng-repeat="field in filedKey_name">{{field}}</th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr ng-repeat="data in datas">
                                <td class="text-align-center" ng-repeat="i in filedKey">{{data[i]}}</td>
                            </tr>
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
        <!-- end row -->
    </section>
    <!-- end widget grid -->
</div>
<!-- END MAIN CONTENT -->
<script>
    var pagefunction = function () {
        // START AND FINISH DATE
        $('#startdate').datepicker({
            //dateFormat : 'dd.mm.yy',
            dateFormat: 'yy-mm-dd',
            prevText: '<i class="fa fa-chevron-left"></i>',
            nextText: '<i class="fa fa-chevron-right"></i>',
            monthNames: ['一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月', '九月', '十月', '十一月', '十二月'],
            dayNames: ['星期日', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六'],
            dayNamesShort: ['周日', '周一', '周二', '周三', '周四', '周五', '周六'],
            dayNamesMin: ['日', '一', '二', '三', '四', '五', '六'],
            onSelect: function (selectedDate) {
                $('#finishdate').datepicker('option', 'minDate', selectedDate);
            }
        });
    };
    pagefunction();
</script>